<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      /*
        cookie: 为什么有cookie
          http: 上下文无关 无状态协议

        set-cookie: 服务端设置

        cookie属性
          name: cookie的名字，具有唯一性
            domain：当前cookie对哪些域名有效，默认为页面打开的路径
            path: cookie的有效路径
            expires: cookie的过期时间，如果不设置，那么这个cookie时效性是会话期的cookie，
              格式为：GMT格式（new Date格式就是GMT），http1.0
            max-age: cookie的有效期，http1.1，格式为ms，设置cookie的存活时间

            HttpOnly：有这个标记的cookie，前端无法获取
            Secure：设置cookie只能通过HTTPS协议传输
            SameSite：设置cookie在跨越请求的时候不能被发送

          value: cookie的值

        注意点：
          1. cookie不可跨越，但是可以跨越在一级域名和二级域名
          2. cookie有大小和数量的限制，不同浏览器下设置不同，大致是数量未50个，大小在4kb左右
          3. cookie前后端都可以设置，cookie每次只能设置一个键值对属性
          4. cookie必须基于htpp协议下才能工作
      */

      document.cookie = "name=zs;";
      // document.cookie = "name=zs;age=18";   // 错误设置

      // cookie的属性
      document.cookie = "color=red;domain=127.0.0.1;path=/";

      document.cookie = `margin=20;expires=${new Date(2228, 1, 1)}`;
      document.cookie = `padding=30;max-age=1`;
    </script>
  </body>
</html>
